<template>
	<div id="appointmentCheck">
		<shyt-table
			ref="shytTable"
			:columns="columns"
			:data="tableData"
			:auto-resize="true"
			:keep-source="true"
			:pager-config="pageConfig"
			:toolbar-config="toolbarConfig"
			:edit-config="{ trigger: 'dbclick', mode: 'row', showStatus: true }"
		>
			<!-- @page-change="pageChange" -->
			<template #orgName="{ row }">
				<span>{{ row.orgName }}</span>
			</template>
			<template #cardId="{ row }">
				<span>{{ row.cardId }}</span>
			</template>
			<template #serialNo="{ row }">
				<span>{{ row.serialNo }}</span>
			</template>
			<template #chargeFlag="{ row }">
				<span>{{ row.chargeFlag }}</span>
			</template>
			<template #patientName="{ row }">
				<span>{{ row.patientName }}</span>
			</template>
			<template #appointExecuteTime="{ row }">
				<span>{{ row.appointExecuteTime | formatDate }}</span>
			</template>
			<template #totalFee="{ row }">
				<span>{{ row.totalFee }}</span>
			</template>
			<template #edit="{ row }">
				<el-button type="text" size="small" @click="deleteAppointmentCheck(row)"
					>取消预约</el-button
				>
			</template>
			<template #toolbar_buttons>
				<el-input
					v-model="inputCode"
					class="user_input"
					placeholder="请输入查找的"
					size="medium"
				></el-input>
				<el-button type="primary" size="small" @click="handlerSave">
					查询
				</el-button>
				<!--				<el-button type="primary" size="small" @click="handlerAddClick">-->
				<!--					新增-->
				<!--				</el-button>-->
			</template>
		</shyt-table>
	</div>
</template>

<script>
import { getPageList, deleteAppointmentCheck } from '@/http/appointmentCheck.js'
import { getSysDataDictList } from '@/http/dict'
export default {
	name: 'ServiceApi',
	data() {
		return {
			// 查询
			inputCode: '',
			// 编辑
			compileRow: {},
			//字典
			dictMap: {
				gender: [],
				nation: [],
			},
			// 新增弹框
			dialogTableVisible: false,
			tableData: [],
			columns: [
				{
					field: 'orgName',
					title: '机构名称',
					slots: { default: 'orgName' },
				},
				{
					field: 'cardId',
					title: '卡ID',
					slots: { default: 'cardId' },
				},
				{
					field: 'serialNo',
					title: '预约流水号',
					slots: { default: 'serialNo' },
				},
				{
					field: 'chargeFlag',
					title: '缴费状态',
					slots: { default: 'chargeFlag' },
				},
				{
					field: 'patientName',
					title: '患者',
					slots: { default: 'patientName' },
				},
				{
					field: 'appointExecuteTime',
					title: '预约执行时间',
					slots: { default: 'appointExecuteTime' },
				},
				{
					field: 'totalFee',
					title: '总费用',
					slots: { default: 'totalFee' },
				},
				{
					title: '操作',
					slots: { default: 'edit' },
				},
			],
			toolbarConfig: {
				slots: {
					buttons: 'toolbar_buttons',
				},
			},
			//分页
			pageConfig: {
				currentPage: 1,
				pageSize: 10,
				pageSizes: [10, 20, 30, 50],
				total: 0,
				background: true,
				layouts: [
					'PrevPage',
					'JumpNumber',
					'NextPage',
					'FullJump',
					'Sizes',
					'Total',
				],
			},
		}
	},
	async created() {
		this.dataList('', this.pageConfig.currentPage, this.pageConfig.pageSize)

		// 性别
		this.dictMap.gender = await this.getSysDataDictList('RC_SEX_DICT')
		// 名族
		this.dictMap.nation = await this.getSysDataDictList('RC_NATION_DICT')
	},
	methods: {
		async getSysDataDictList(typeCode) {
			let param = { type: typeCode, delFlag: '0', whetherEnable: '0' }
			let list = []
			let res = await getSysDataDictList(param)
			if (res.data?.head?.code == 200) {
				list = res.data.data
			}
			return list
		},
		dataList(inputCode, pageNum, pageSize) {
			getPageList({
				inputCode: inputCode,
				pageNum: pageNum,
				pageSize: pageSize,
			}).then(({ data }) => {
				this.tableData = data.data.records
				this.pageConfig.total = data.data.total
				console.log(data.data.records)
			})
		},
		//分页
		pageChange({ currentPage, pageSize }) {
			this.dataList(this.userInput.toUpperCase(), currentPage, pageSize)
			this.pageConfig.currentPage = currentPage
			this.pageConfig.pageSize = pageSize
		},
		// 查询
		handlerSave() {
			this.pageConfig.currentPage = 1
			this.pageConfig.pageSize = 10
			this.dataList(
				this.inputCode,
				this.pageConfig.currentPage,
				this.pageConfig.pageSize,
			)
		},
		// 新增
		handlerAddClick() {
			this.dialogTableVisible = true
		},

		// 编辑
		handlerEditRow(row) {
			this.dialogTableVisible = true
			this.compileRow = this._.cloneDeep(row)
			console.log(row)
		},
		// 解绑
		deleteAppointmentCheck(row) {
			console.log(row, '取消预约')
			this.$confirm('是否取消预约?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning',
			}).then(() => {
				deleteAppointmentCheck({
					id: row.id,
					orgId: row.orgId,
				}).then(({ data }) => {
					console.log(data)
					if (data.head.code == 200) {
						this.$message({
							type: 'success',
							message: '取消预约成功!',
						})
						this.dataList(
							this.inputCode,
							this.pageConfig.currentPage,
							this.pageConfig.pageSize,
						)
					}
				})
			})
		},

		//字典找值
		dictModelFun(dictList, cellVal) {
			let str = '-'
			if (dictList) {
				let obj = dictList.find(e => cellVal == e.value)
				if (obj) {
					str = obj.display
				}
			}
			return str
		},
	},
}
</script>

<style lang="scss" scoped>
.user_input {
	width: 200px;
}
</style>
